<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
    <!-- <link rel="stylesheet" type="text/css" href="{$_G['URL']['YX2020_CSS']}css/reset.css"> -->

    <script src="https://css2020.yixuan.net/2020css/yx2020/js/jquery.js?v=2"></script>
    <link rel="stylesheet" type="text/css" href="https://css2020.yixuan.net/2020css/yx2020/css/reset.css">
    <link rel="stylesheet" type="text/css" href="https://css2020.yixuan.net/2020css/yx2020/css/swiper.min.css">

    <script src="https://css2020.yixuan.net/2020css/yx2020/js/swiper-3.4.2.min.js"></script>
    <script src="{$_G['URL']['LOTTERY_CSS']}lottery/js/layer/layer.js"></script>
    <script>
        init();
        window.onresize = init;
        function init(){
            document.documentElement.style.fontSize =
                document.documentElement.clientWidth / 7.5 + 'px';
        }
    </script>
    <title>{$theme['title']}-我的</title>
    <style>
        body{
            background: #f7f7f7;
            padding-bottom: 1.13rem;
        }
        .wrap{
            margin: 0.36rem auto;
            width: 7.18rem;
        }
        .wrap .top{
            position: relative;
            background-image: linear-gradient(116deg,#fe7e8c,#f8347d);
            border-radius: 0.2rem;
            padding: 0.3rem 0.35rem;
        }
        .wrap .top::before{
            content: "";
            background-image: url({$_G['URL']['BEILAI_IMG']}/light.png);
            background-repeat: no-repeat;
            background-position: 50% top;
            position: absolute;
            right: 1rem;
            top: 0;
            width: 2.47rem;
            height: 2.07rem;
            background-size: 2.47rem 2.07rem;
        }
        .wrap .top .user{
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }
        .wrap .top .user img{
            width: 0.87rem;
            height: 0.87rem;
            border-radius: 0.87rem;
        }
        .wrap .top .user .name{
            font-size: 0.32rem;
            color: #ffffff;
            padding-left: 0.26rem;
        }
        .wrap .top .money{
            margin-top: 0.7rem;
            display: flex;
            justify-content: flex-start;
            text-align: center;
            position: relative;
        }


        .wrap .top .money:after{
            content: "";
            background: url({$_G['URL']['BEILAI_IMG']}/arrow.png) no-repeat center center;
            width: 0.12rem;
            height: 0.2rem;
            background-size: 0.12rem 0.2rem;
            position: absolute;
            right: 0;
            top: 0;
            bottom: 0;
            margin: auto;
        }


        .wrap .top .money .m_icon{
            width: 0.38rem;
            height: 0.32rem;
            margin-left: 0.2rem;
        }
        .wrap .top .money .item{
            font-size: 0.28rem;
            color: #ffffff;
            padding: 0 0.3rem;
            position: relative;
        }
        .wrap .top .money .item::after{
            content: "";
            position: absolute;
            right: 0;
            top: 0;
            bottom: 0;
            margin: auto;
            width: 0.01rem;
            height: 0.28rem;
            background-color: rgba(255,255,255,0.3);
        }
        .wrap .top .money .item:last-child::after{
            display: none;
        }
        .wrap .top .money .item span{
            color: #ffee78;
        }
        .wrap .m_item{
            padding: 0 0.3rem;
            margin-top: 0.18rem;
            background: #ffffff;
            border-radius: 0.2rem;
        }
        .wrap .m_item .h{
            height: 1.04rem;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            position: relative;
        }

        .wrap .m_item .h:after,.wrap .m_item .h:before {
            width: 0;
            height: 0;
            border: 0.1rem solid transparent;
            border-left-color: #ffffff;
            position: absolute;
            content: "";
            right: 0.42rem;
            top: 0;
            bottom: 0;
            margin: auto;
        }
        .wrap .m_item .h:before{
            top: 0;
            right: 0.4rem;
            border-left-color: #999999;
        }
        .wrap .m_item .h .icon{
            width: 0.33rem;
            height: 0.33rem;
        }
        .wrap .m_item .h span{
            color: #333333;
            font-size: 0.28rem;
            padding-left: 0.2rem;
        }
        .wrap .invite{
            height: auto;
            padding-bottom: 0.27rem;
        }
        .wrap .invite .nums{
            display: flex;
            justify-content: space-between;
        }
        .wrap .invite .nums .num1,.wrap .nums .num2{
            width: 3.15rem;
            height: 1.19rem;
            border-radius: 0.2rem;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            line-height: 0.4rem;
        }
        .wrap .invite .nums .num1{
            background: linear-gradient(to right,#ffe8eb,#fff9fa);;
        }
        .wrap .invite .nums .num2{
            background: linear-gradient(to right,#e8f6ff,#f9fdff);;
        }
        .wrap .invite .nums .num{
            font-size: 0.3rem;
        }
        .wrap .invite .nums .n_txt{
            font-size: 0.24rem;
        }
        .wrap .invite .num1 .num{
            color: #f8347d;
        }
        .wrap .invite .num1 .n_txt{
            color: #d4919a;
        }
        .wrap .invite .num2 .num{
            color: #1569da;
        }
        .wrap .invite .num2 .n_txt{
            color: #8ca8da;
        }
        .wrap .table{
            padding: 0.2rem;
            text-align: center;
        }
        .wrap .table .thead{
            width: 6.76rem;
            height: 0.51rem;
            line-height: 0.51rem;
            color: #999999;
            font-size: 0.24rem;
            display: flex;
            justify-content: space-around;
            align-items: center;
            background: #f6f8fa;
            border-radius: 0.2rem;
        }
        .wrap .table .col1{
            width: 2.05rem;
        }
        .wrap .tr .col1{
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .wrap .table .col2{
            width: 1.5rem;
        }
        .wrap .table .col3{
            width: 2.8rem;
        }
        .wrap .table .tr{
            width: 6.76rem;
            line-height: 0.65rem;
            height: 0.65rem;
            color: #333333;
            font-size: 0.24rem;
            display: flex;
            justify-content: space-around;
            align-items: center;
            border-radius: 0.2rem;
            padding: 0.18rem 0;
        }
        .wrap .table .tr:last-child{
            padding-bottom: 0;
        }
        .wrap .table .tr .col1 img{
            width: 0.65rem;
            height: 0.65rem;
            border-radius: 0.65rem;
            margin-right: 0.22rem;
        }
        .wrap .table .tr .col1 span{
            font-size: 0.28rem;
        }
        .wrap .tech{
            margin-top: 0.16rem;
            font-size: 0.24rem;
            color: #999999;
            text-align: center;
        }
        .wrap .tech .a{
            color: #2a8bee;
        }
        .join{
            height: 0.86rem;
            padding: 0.2rem 0.4rem;
            background-image: url({$_G['URL']['BEILAI_IMG']}/f_bg.jpg);
            background-repeat: no-repeat;
            background-position: center center;
            background-size: 7.5rem 1.26rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .join .head{
            width: 0.88rem;
            height: 0.88rem;
            border-radius: 0.2rem;
        }
        .join .name{
            padding-left: 0.16rem;
        }
        .join .name .n_top{
            font-size: 0.28rem;
            color: #ffffff;
        }
        .join .name .bot{
            font-size: 0.22rem;
            color: #ffb2e0;
        }
        .join .btn{
            background-image: linear-gradient(to right,#fffacf,#ffe5ad);
            width: 1.15rem;
            height: 0.59rem;
            border-radius: 0.59rem;
            font-size: 0.22rem;
            color: #cd1c1c;
            text-align: center;
            line-height: 0.59rem;
        }

        .footer{
            position: fixed;
            bottom: 0;
            background: #ffffff;
            width: 7.5rem;
            left: 0;
            right: 0;
            z-index: 2;
        }
        .footer .f_btn{
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 1.13rem;
        }
        .footer .menus{
            display: flex;
            justify-content: space-around;
            align-items: center;
            width: 2.1rem;
            padding-left: 0.16rem;
        }
        .footer .menu1{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .footer .menu1 img{
            width: 0.32rem;
            height: 0.37rem;
        }
        .footer .menu1 span{
            font-size: 0.22rem;
            color: #999999;
            padding-top: 0.09rem;
        }
        .footer .menu2 img{
            width: 0.33rem;
            height: 0.36rem;
        }
        .footer .menu2{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .footer .menu2 span{
            font-size: 0.22rem;
            color: #999999;
            padding-top: 0.09rem;
        }
        .footer .button{
            width: 4.69rem;
            height: 0.86rem;
            background:linear-gradient(to right,#f82079,#fe878e);
            color: #ffffff;
            font-size: 0.28rem;
            display: flex;
            justify-content: center;
            align-items: center;
            margin-right: 0.26rem;
            border-radius: 0.2rem;
        }
        .footer .btns{
            width: 4.69rem;
            height: 0.86rem;
            color: #ffffff;
            font-size: 0.28rem;
            display: flex;
            justify-content: space-around;
            border-radius: 0.2rem;
            overflow: hidden;
            margin-right: 0.26rem;
        }
        .footer .btns span{
            flex-grow:1;
            height: 0.86rem;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .footer .btns span:nth-child(1){
            background:linear-gradient(to right,#fba384,#fd888e);
        }
        .footer .btns span:nth-child(2){
            background:linear-gradient(to right,#f82079,#fe878e);
        }
        .footer .button.over{
            background: #f3f3f3;
            color: #999999;
        }
        .footer .button img{
            width: 0.3rem;
            height: 0.3rem;
            margin-right: 0.12rem;
        }


    </style>
</head>
<body>
<div class="wrap">
    <div class="top">
        <div class="user">
            <img src="{$fans['avatar']}">
            <span class="name">{php echo $fans['username']?$fans['username']:$fans['nickname'];}</span>
        </div>
        <div class="money">
            <img class="m_icon" src="{$_G['URL']['BEILAI_IMG']}/money.png">
            <div class="item">钱包余额<span>￥{$commssum}</span></div>
            <div class="item">历史提现<span>￥{php echo $totalsuccess?$totalsuccess:0;}</span></div>
        </div>
    </div>
    <a href="/{php echo createMobileUrl('wx', array('themeid'=>$themeid,'r'=>'beilai.index.reword','from'=>'mobile'));}">
        <div class="m_item">
            <div class="h">
                <img class="icon" src="{$_G['URL']['BEILAI_IMG']}/bonus.png">
                <span>我的奖励</span>
            </div>
        </div>
    </a>


    <a href="/{php echo createMobileUrl('wx', array('themeid'=>$themeid,'r'=>'beilai.index.mineCourse','from'=>'mobile'));}">
        <div class="m_item">
            <div class="h">
                <img class="icon" src="{$_G['URL']['BEILAI_IMG']}/bonus.png">
                <span>我的课程</span>
            </div>
        </div>
    </a>

    <div class="invite m_item">
        <div class="h">
            <img class="icon" src="{$_G['URL']['BEILAI_IMG']}/invite.png">
            <span>我的数据</span>
        </div>
        <div class="nums">
            <div class="num1">
                <span class="num">{$user_share_num}</span>
                <span class="n_txt">分享人数</span>
            </div>
            <div class="num2">
                <span class="num">{$user_tuijian_num}</span>
                <span class="n_txt">邀请人数</span>
            </div>
        </div>
    </div>
<!--    邀请列表-->
    <div class="m_item table">
        <ul class="thead">
            <li class="col1">用户</li>
            <li class="col2">身份</li>
            <li class="col3">时间</li>
        </ul>
        {loop $tuijian_list $item}
        <ul class="tr">
            <li class="col1">
                <img src="{$item['avatar']}">
                <span>{$item['username']}</span>
            </li>
            {if $item['type']==0}
            <li class="col2">团长</li>
            {elseif $item['type']==1}
            <li class="col2">团员</li>
            {else}
            <li class="col2">单买</li>
            {/if}
            <li class="col3">{php echo date("Y-m-d H:i:s",time());}</li>
        </ul>
        {/loop}
    </div>
<!--    <div class="m_item">-->
<!--        <div class="h">-->
<!--            <img class="icon" src="{$_G['URL']['BEILAI_IMG']}/serv.png">-->
<!--            <span>服务协议</span>-->
<!--        </div>-->
<!--    </div>-->
    {if !$theme['yixuanbanquan']}
    <div class="tech">
        <p>{$theme['USERJISHU']}</p>
<!--        <p>电话：张经理 13274321567(微信同号)</p>-->
        <p><a href="{$theme['USERURL']}">{$theme['USERCOMPANYNAME']}</a></p>
    </div>
    {/if}

    <div class="footer">
        <div class="f_btn">
            <div class="menus">
                <a class="menu1" href="/{php echo createMobileUrl('index', array('themeid'=>$themeid));}">
                    <img src="{$_G['URL']['BEILAI_IMG']}/home.png">
                    <span>首页</span>
                </a>
                <div class="menu2" onclick="showService()">
                    <img src="{$_G['URL']['BEILAI_IMG']}/b_icon2.png">
                    <span>客服</span>
                </div>
            </div>
            <!-- <div class="button over">
                <img src="image/imoj.png">
                <span>活动已结束</span>
            </div> -->
            {if $poster_info['img_url']}
            <div class="button" onclick="showPoster()">
                <span>领取我的活动海报</span>
            </div>
            {else}
            <div class="button" onclick="showPoster()">
                <span>{$poster_info['tips']}</span>
            </div>
            {/if}
        </div>
        <!-- <div class="btns">
            <span>立即参与二</span>
            <span>立即参与</span>
        </div> -->
    </div>

</div>

{include file='../../plugin/beilai/template/mobile/poster'}
<!--<a href="/{php echo createMobileUrl('about', array('themeid'=>$themeid));}">-->
<!--    <div class="join" style="background-image: url({$setting['btm_img']})">-->
<!--        &lt;!&ndash; <img class="head" src="image/g_head.png" alt=""> &ndash;&gt;-->
<!--        &lt;!&ndash; <div class="name">-->
<!--            <div class="n_top">番茄裂变</div>-->
<!--            <div class="bot">你也可以加入这样的活动，共同正常</div>-->
<!--        </div>-->
<!--        <div class="btn">立即参与</div> &ndash;&gt;-->
<!--    </div>-->
<!--</a>-->

</body>
{include file='base/addlog'}
</html>
